<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="__ROOT__/Public/Admin/shortcut icon" href="favicon.ico">
	<link href="__ROOT__/Public/Admin/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
	<link href="__ROOT__/Public/Admin/css/animate.css" rel="stylesheet">
	<link href="__ROOT__/Public/Admin/css/style.css" rel="stylesheet">
	
	<link href="__ROOT__/Public/Admin/js/plugins/bootstrap-editable/css/bootstrap-editable.css" rel="stylesheet" />
	<link href="__ROOT__/Public/Admin/js/plugins/bootstrap221/css/editable.css" rel="stylesheet" />
	<link href="__ROOT__/Public/Admin/js/plugins/sweetalert/sweetalert.css" rel="stylesheet">
</head>
<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="ibox float-e-margins">
            <div class="ibox-content">
                <table class="table table-bordered table-striped text-center" data-mobile-responsive="true">
                    <thead>
                    </thead>
                    <tbody>
                    	<tr style="background-color:#efd38a !important;">
                            <th colSpan="7" style="font-weight: normal">
                            	<span class="title" style="font-size:17px;">项目名称：</span>
                    			<span class="title" style="font-size:15px;" id="projectName"></span>
                            </th>
                        </tr>
                        <tr style="background-color:#305cf1 !important; color:#FFFFFF;" >
                            <td style="width:11%">工作事项</td>
                            <td style="width:12%">开始时间</td>
                            <td style="width:12%">结束时间</td>
							<td style="width:10%">持续天数</td>
							<td style="width:20%">输出物</td>
							<td style="width:15%">负责单位</td>
                            <td style="width:15%">配合部门/单位</td>
                        </tr>
							<tr style="background-color:#efd38a" id="Getready">
								<td>一、准备阶段</td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr style="background-color:#ececec;" id="AA">
								<td colspan="7" >  
									<a onclick="additem(1,this)">添加准备阶段计划</a>
								</td>
							</tr>
							<tr style="background-color:#efd38a" id="startup">
								<td>二、启动阶段</td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr style="background-color:#ececec;" id="">
								<td colspan="7" >  
									<a onclick="additem(2,this)">添加启动阶段计划</a>
								</td>
							</tr>
							<tr style="background-color:#efd38a" id="Implementations">
								<td>三、实施阶段</td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr style="background-color:#ececec;" id="">
								<td colspan="7" >  
									<a onclick="additem(3,this)">添加实施阶段计划</a>
								</td>
							</tr>
							<tr style="background-color:#efd38a" id="check">
								<td>四、验收阶段</td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
								<td></td>
							</tr>
							<tr style="background-color:#ececec;" id="">
								<td colspan="7" >  
									<a onclick="additem(4,this)">添加验收阶段计划</a>
								</td>
							</tr>

               		</tbody>
          		</table>
            </div>
        </div>
    </div>
	<img src="__ROOT__/Public/Admin/img/loading.gif" class="loading" style="display:none;">			    
</body>

<script src="__ROOT__/Public/Admin/js/jquery.min.js"></script>
<script src="__ROOT__/Public/Admin/js/plugins/laydate/laydate.js"></script>
<script src="__ROOT__/Public/Admin/js/plugins/bootstrap221/js/bootstrap.min.js"></script>
<script src="__ROOT__/Public/Admin/js/plugins/bootstrap-editable/js/bootstrap-editable.js"></script>
<script src="__ROOT__/Public/Admin/js/plugins/sweetalert/sweetalert.min.js"></script>
	
<link href="__ROOT__/Public/Admin/css/selector/selectorstyle.css" rel="stylesheet"/>
<script src="__ROOT__/Public/Admin/js/plugins/selector/selector.js"></script>
<script src="__ROOT__/Public/Admin/js/plugins/selector/jquery.ztree.all.js"></script>
 	
<script>

	var projectID;
	var i = 0;
	tableGetData();
	
	function additem(type,dom){
		i++;
		var newhtml = "<tr style=\"background-color:#ffffff\"><td></td><td class='StartTime"+i+"'></td><td class='EndTime"+i+"'></td><td class='continued"+i+"'></td><td><div class='OutputContent"+i+" myeditable'></div></td><td style='display:none;' class='OtherDptID"+i+"'></td><td style='display:none;' class='DptID"+i+"'></td><td class='DptName"+i+"' onclick=\"tablefun('DptID"+i+"','DptName"+i+"')\" data-toggle=\"modal\" data-target=\"#myModal\"></td><td class='OtherDptName"+i+"' onclick=\"tablefun('OtherDptID"+i+"','OtherDptName"+i+"')\" data-toggle=\"modal\" data-target=\"#myModal\"></td></tr>";
	  $(dom).parent().parent().before(newhtml);
      $(dom).text("点击保存");
	  $(dom).attr('onclick', '');
	  $(dom).attr('onclick', "tableAddData(this,"+ type +")");
	  TieEvent();
	}
	
	function getcontinued(value,Time,itemid){
		var timestamp1 = Date.parse(new Date(value));
		timestamp1 = timestamp1 / 1000;
		times = $("."+Time+itemid).text();
		var timestamp2 = Date.parse(new Date(times));
		timestamp2 = timestamp2 / 1000;
		endtimestamp = timestamp1 > timestamp2 ? timestamp1 - timestamp2 : timestamp2 - timestamp1;
		if(endtimestamp != '' && !isNaN(endtimestamp)){
			var continued = endtimestamp / (60*60*24);
			$(".continued"+itemid).text(parseInt(continued)+'天');
			return continued;
		}
	}

 	function tablefun(id,name){
 		openselector(id,name, function(name,id){
 			var timeid = $("."+name).parent().attr("id");
 			var timetype = $("."+name).parent().attr("class");
 			if(timeid != undefined){
 				var timevale = $("."+id).text();
 				var reg = /\D*/;
				var idtype = reg.exec(id);
				if(idtype == "DptID"){
					var updatedata = {
		 				"ProjectID": projectID,
		 				"DptID": timevale,
		 				"WorkItem": timetype,
		 				"ID": timeid
		 			}	
				}else if(idtype == "OtherDptID"){
					var reg = /\d+/g;
 					var DptID = reg.exec(id);
 					DptID = $(".DptID"+DptID[0]).text();
					var updatedata = {
		 				"ProjectID": projectID,
		 				"DptID": DptID,
		 				"OtherDpt": timevale,
		 				"WorkItem": timetype,
		 				"ID": timeid
		 			}
				}
 				tableUpdate(updatedata);
 			}
 		});
 	}
 	
 	function tableUpdate(data){
 		$(".loading").show();
 		$.post("{:U('Admin/ProjectPlan/save')}&type=update",data,function(result){
 			$(".loading").hide();
 			if (result.status) {
		       swal("提示", result.info, "success");
		    }else{
		    	swal({
		            title: "",
		            text: "修改失败 "+result.info,
		            type: "error",
		            showCancelButton: false,
		            confirmButtonColor: "#DD6B55",
		            confirmButtonText: "确认",
		            cancelButtonText: "",
		            closeOnConfirm: false,
		            closeOnCancel: false
		        },function (isConfirm) {
		            document.location.reload();
		        });		
		    }
 		});
 	}
 	
 	function tableAddData(dom,type){
 		var td = $(dom).parent().parent().prev().children();
 		data = {
 			"StartTime" : $(td[1]).text(),
 			"EndTime" : $(td[2]).text(),
 			"continued" : $(td[3]).text(),
 			"OutputContent" : $(td[4]).text(),
 			"OtherDpt" : $(td[5]).text(),
 			"DptID" : $(td[6]).text(),
 			"WorkItem" : type,
 			"ProjectID" : projectID
 		};
 		tableSetData(data);
 	};
 	
 	function tableSetData(data){
 		$.post("{:U('Admin/ProjectPlan/save')}&type=add",{
 			"StartTime":data.StartTime,
 			"EndTime":data.EndTime,
 			"continued":data.continued,
 			"OutputContent":data.OutputContent,
 			"DptID":data.DptID,
 			"OtherDpt":data.OtherDpt,
 			"WorkItem":data.WorkItem,
 			"ProjectID":data.ProjectID
 		},function(result){
		    if (result.status) {
		    	 swal({
		            title: "继续操作？",
		            text: "操作成功！",
		            type: "success",
		            showCancelButton: false,
		            confirmButtonColor: "#DD6B55",
		            confirmButtonText: "确认",
		            cancelButtonText: "",
		            closeOnConfirm: false,
		            closeOnCancel: false
		       },function (isConfirm) {
		            document.location.reload();
		       });			
		    }else{
		    	swal("提示", result.info, "error");
		    }
		});
 	}
 	
 	function tableGetData(){
 		$(".loading").show();
 		$.post("<?=U('Admin/ProjectPlan/save',array('type'=>'table','id'=>$id))?>",{},function(result){
	 		data = result;
	    	$("#projectName").html(data.projectName);
	    	projectID = data.projectID;
			for(var list in data.data){
				var listdata,dom,type;
				if(data.data[list].Getready != undefined){
					listdata = data.data[list].Getready; 
					dom = $("#Getready");
					type = 1;
				}else if(data.data[list].startup != undefined){
					listdata = data.data[list].startup;
					dom = $("#startup");
					type = 2;
				}else if(data.data[list].Implementations != undefined){
					listdata = data.data[list].Implementations;
					dom = $("#Implementations");
					type = 3;
				}else if(data.data[list].check != undefined){
					listdata = data.data[list].check;
					dom = $("#check");
					type = 4;
				}
				for(var listKey in listdata){
					for(var itmeKey in listdata[listKey]){
						var ID = listdata[listKey][itmeKey][6].ID;
						i++;
						var itmeHtml = "<tr itmeID="+i+" id="+ID+" class="+type+" style=\"background-color:#FFFFFF\"><td></td><td class='StartTime"+i+"'>"+listdata[listKey][itmeKey][0].StartTime+"</td><td class='EndTime"+i+"'>"+listdata[listKey][itmeKey][1].EndTime+"</td><td class='continued"+i+"'>"+listdata[listKey][itmeKey][2].continued+"天</td><td ><div class='OutputContent"+i+" myeditable'>"+listdata[listKey][itmeKey][3].OutputContent+"</div></td><td class='DptName"+i+"' onclick=\"tablefun('DptID"+i+"','DptName"+i+"')\" data-toggle=\"modal\" data-target=\"#myModal\">"+listdata[listKey][itmeKey][4].DptName+"</td><td class='OtherDptName"+i+"' onclick=\"tablefun('OtherDptID"+i+"','OtherDptName"+i+"')\" data-toggle=\"modal\" data-target=\"#myModal\">"+listdata[listKey][itmeKey][5].OtherDptName+"</td><td style='display:none;' class='OtherDptID"+i+"'></td><td style='display:none;' class='DptID"+i+"'>"+listdata[listKey][itmeKey][7].DptID+"</td></tr>";
						$(dom).after(itmeHtml);
						TieEvent();
					}
				}	
			}
			$(".loading").hide();
	  	});
 	}
 	
 	function TieEvent(){
 		
 		laydate.render({
		  elem: '.StartTime'+i,
		  theme: 'molv',
		  type: 'datetime',
		  itemid: i,
		  done:function(value,date){
		  	var continued = getcontinued(value,"EndTime",this.itemid);
		  	var tr = $('.StartTime'+this.itemid).parent();
		  	if($(tr).attr("id") == undefined) return;
			var updatedata = {
		 		"ProjectID": projectID,
		 		"DptID": $(".DptID"+this.itemid).text(),
		 		"StartTime": value,
		 		"WorkItem": $(tr).attr("class"),
		 		"ID": $(tr).attr("id"),
		 		"continued": continued
		 	}
			tableUpdate(updatedata);
		  }
		});
		
		laydate.render({
		  elem: '.EndTime'+i,
		  theme: 'molv',
		  type: 'datetime',
		  itemid: i,
		  done:function(value,date){
			var continued = getcontinued(value,"StartTime",this.itemid);
			var tr = $('.EndTime'+this.itemid).parent();
			if($(tr).attr("id") == undefined) return;
			var updatedata = {
		 		"ProjectID": projectID,
		 		"DptID": $(".DptID"+this.itemid).text(),
		 		"EndTime": value,
		 		"WorkItem": $(tr).attr("class"),
		 		"ID": $(tr).attr("id"),
		 		"continued": continued
		 	}
			tableUpdate(updatedata);
		  }
		});
		
		$('.OutputContent'+i).editable({
            type: "textarea",             
            title: "输出物",           
            disabled: false,           
            emptytext: "",
            mode: "popup",          
            validate: function (value) { //字段验证
                if (!$.trim(value)) {
                    return '不能为空';
                }else{
                	var tr = $(this).parent().parent();
                	if($(tr).attr("id") == undefined) return;
                	var timeid = $(tr).attr("id");
 					var timetype = $(tr).attr("class");
 					var DptID = $(".DptID"+$(tr).attr("itmeID")).text();
 					var updatedata = {
		 				"ProjectID": projectID,
		 				"DptID": DptID,
		 				"OutputContent": value,
		 				"WorkItem": timetype,
		 				"ID": timeid
		 			}
 					tableUpdate(updatedata);
                }
            }
     	});
 	}
 	
</script>
<style>
	.loading{
			 width: 35px;
			 height: 35px;
			 margin: 0 auto;
			 margin-top:100px;
			 position: fixed;
			 top: 0px;
			 left: 0px;
			 right: 0px;
			 bottom: 0px;
			 margin: auto;
		}
</style>

</html>